import base_control from "@/lib/core/base_control.js"
import vNode from "@/lib/core/structs/render_vNode.js"
function page(args = undefined, context = undefined, compile_source_file = undefined) {
    this.constructor_template = {
        functional: true,
        name: "t-page",
        data() {
            return {
                vtext: 'bbb'
            };
        },
        mounted() {
            //this.text="ccccccccccc"
        },
        method: {
            myClick: (event)=> {
                this.vtext = "ccccccccc"
            }
        },
        props: {
            columns: { Array, default: () => [] },
            dataSource: { Array, default: () => [] }
        }
    };

    this.render_ops = (args == undefined | args == null) ? {
        el: "#app",
        //parentEl:'tests',
        //mountType:"append",
        propsData: {
            columns: [
                {
                    title: "name",
                    dataIndex: 'name',
                    key: 'name'
                },
                {
                    title: 'Age',
                    dataIndex: 'age',
                    key: 'age',
                },
                {
                    title: 'Address',
                    dataIndex: 'address',
                    key: 'address',
                }
            ],
            dataSource: [
                {
                    key: '1',
                    name: 'John Brown',
                    age: 32,
                    address: 'New York No. 1 Lake Park'
                },
                {
                    key: '2',
                    name: 'Jim Green',
                    age: 42,
                    address: 'London No. 1 Lake Park'
                },
                {
                    key: '3',
                    name: 'Joe Black',
                    age: 32,
                    address: 'Sidney No. 1 Lake Park'
                },
            ]
        }
    } : args;

    this.v_node = new vNode('div');
    let layout = this.v_node.appendChild("a-layout", { attrs: { id: "components-layout-demo-top-side-2" } })
    let head = layout.appendChild('a-layout-header')
    head.appendChild("div", {
        class: "logo"
    })
    head.appendChild('a-menu', {
        attrs: { theme: "dark", mode: "horizontal" }, style: {
            lineHeight: "64px"
        }
    }).appendChild('a-menu-item', { attrs: { key: 1 } }).setValue('nav 1').getParent().appendChild('a-menu-item', { attrs: { key: 2 } }).setValue('nav 2').getParent().appendChild('a-menu-item', { attrs: { key: 3 } }).setValue('nav 3')
    let container = layout.appendChild('a-layout')
    let left = container.appendChild('a-layout-sider', {
        style: {
            width: "200px",
            background: "#fff"
        }
    }).appendChild('a-menu', {
        attrs: {
            mode: "inline"
        },
        style: {
            height: "100%",
            borderRight: 0
        }
    }).appendChild("a-menu-item", {
        attrs: {
            key: 1
        }
    }).setValue('nav 1').getParent().appendChild("a-menu-item", { attrs: { key: 2 } }).setValue('nav 2')
    let right = container.appendChild('a-layout', {
        style: {
            padding: "0 24px 24px"
        }
    })
    let right_nav = right.appendChild('a-breadcrumb', { style: { margin: "16px 0" } }).appendChild('a-breadcrumb-item').setValue('Home').getParent().appendChild('a-breadcrumb-item').setValue('List').getParent().appendChild('a-breadcrumb-item').setValue('App')
    let content_container = right.appendChild('a-layout-content', {
        style: {
            background: "#fff",
            padding: "24px",
            margin: 0,
            minHeight: "280px;"
        }
    })
    content_container.appendChild('a-button', { attrs: { type: "primary" }, on: { 
        click: (event)=>{
            let self= this._instance
            self.vtext='eeeeeeeeeeeeeeeeeeeeee'
            self.$emit('click',event)
        }
    }, style: { marginBottom: "20px",marginLeft:'10px' } }).setDataSource([{text:'testBtn1'},{text:'testBtn2'}]).appendChild('span', { slot: "default" }).setValue("self.text")
    content_container.appendChild('a-button', { style: { marginBottom: "20px", marginLeft: "10px" } }).appendChild('span', { slot: "default" }).setValue("self.vtext")
    let content_content = content_container.appendChild('a-table', {
        attrs: { columns: 'self.columns', dataSource: 'self.dataSource' }
    })/*.appendChild('span',{
                slots:"name",
                slotScope:"text"
            }).setValue("self.text").getParent().appendChild('span',{slots:"customTitle"}).appendChild('a-icon',{
                attrs:{
                    type:"smile-o"
                }
            }).setValue("Name").getParent().getParent().appendChild('span',{
                slots:"tags",
                slotScope:"tags"
            }).appendChild('a-tag',{
                propsData:{
                    key:"tag",
                    color:""
                }
            }).setValue('self.tag')*/
    this.build({ constructor: this.constructor_template, render: this.render_ops, vnode: this.v_node, compile_file: compile_source_file })
    this._instance["dataSource"]=this.context.dataSource
}

pageLayout.prototype = new base_control();
pageLayout.prototype.constructor = page;
export default pageLayout